<template lang="">
    <div class="container">
    <a-menu v-model="current" mode="horizontal" class="menu" @click="handleClick"> 
      <a-menu-item key="home"> <a-icon type="mail" />首页 </a-menu-item>
  
      <a-sub-menu>
        <span slot="title" class="submenu-title-wrapper"
          ><a-icon type="setting" />运维</span
        >
        <a-menu-item-group title="常用">
          <a-menu-item key="operation-home">
            ids 运行管理
          </a-menu-item>
          <a-menu-item key="operation-rule">
            ids 抓包过滤规则管理
          </a-menu-item>
          <a-menu-item key="detect-rule">
            ids 检测规则管理
          </a-menu-item>
        </a-menu-item-group>
      </a-sub-menu>
       <a-sub-menu>
        <span slot="title" class="submenu-title-wrapper"
          ><a-icon type="setting" />监控</span
        >
        <a-menu-item-group title="抓取任务管理">
          <a-menu-item key="monitor-record">
            监控记录管理
          </a-menu-item>
          <a-menu-item key="monitor-mail">
            邮件推送管理
          </a-menu-item>
        </a-menu-item-group>
      </a-sub-menu>
      <a-menu-item key="about">
         <a-icon type="mail" />关于
      </a-menu-item>
    </a-menu>
    </div>
</template>
<script>
export default {
    data(){
        return {
             current: ['mail'],
        }
    },
    methods: {
      handleClick(item){
        this.$router.push({name:item.key})
      }
    }
}
</script>
<style lang="less" scoped>
.menu{
  height: 100% !important;
}

.container{
  height: 100%;
}
</style>